<template>
  <div>
    <to-search></to-search>
    <cate-vue></cate-vue>
    <banner-vue></banner-vue>
    <goods-vue></goods-vue>
  </div>
</template>

<script>
import cateVue from "./conponents/cateVue.vue";
import bannerVue from "./conponents/bannerVue.vue";
import goodsVue from "./conponents/goodsVue.vue";

export default {
  components: {
    cateVue,
    bannerVue,
    goodsVue,
  },
  data() {
    return {
      arr: [],
    };
  },
  methods: {
    // pushSearch() {
    //   this.$router.push("/search");
    // },
    // replaceSearch() {
    //   this.$router.replace("/search");
    // },
  },
  mounted() {
    // 下拉刷新页面
    window.ontouchstart = (e) => {
      this.startY = e.touches[0].clientY;
    };
    window.ontouchmove = (e) => {
      this.endY = e.touches[0].clientY;
    };
    window.ontouchend = (e) => {
      if (this.endY !== 0 && this.startY_20 < this.endY) {
        // 刷新页面
        this.$router.go(0);
      }
    };
  },
  beforeDestroy() {
    window.ontoustart = window.ontouchmove = window.ontouchend = null;
  },
};
</script>

<style lang="less" scoped>
@import "../../less/index.less";
.box {
  width: 6rem;
  height: 0.6rem;
  border: 0.01rem solid #000;
  margin: 0.2rem auto;
  border-radius: 0.1rem;
  position: relative;
}
.zi {
  position: absolute;
  top: 0.15rem;
  left: 0.2rem;
  font-size: 0.3rem;
}
.smlbox {
  font-size: 0.4rem;
  position: absolute;
  right: 0.2rem;
  top: 0.05rem;
}
</style>